yubo 个人技术博客

工具方法

• 实例方法：$.fn.
• 工具方法：$.

判断类型

$.type();  // 里面的数据到底是什么  typeof()：里面的数据是什么类型
$.isArray();
$.isFunction();
$.isWindow();

$.trim() 去除前后空格

$.trim('  ab c   ');  //--> ab c

$.proxy()

function show () { console.log(this) }
var obj = { name: 'bozai' }
var showProxy = $.proxy(show, obj);  // 改变this指向
showProxy();  //--> {name: "bozai"}

遍历

var arr = [1, 2, 3, 4];
$.each(arr, function (index, ele) {console.log(ele)});  // forEach 前身
$.map(arr, function (ele, index) {console.log(ele)});

$.parseJSON 将字符串转为json

var json = '{"a" : 123, "b" : 123, "c" : true}'
$.parseJSON(json);

$.makeArray 类数组转数组

var obj = {
    0: 'a',
    1: 'b',
    2: 'c',
    length: 3,
};
[].slice.call(obj, 0);
var newObj = $.makeArray(obj);
$.makeArray('d', obj);  // 会将第一个参数塞进类数组中，类型由最后一个参数决定

添加工具方法

$.extend({
    random: function (min, max) {
        return Math.floor(Math.random() * (max - min) + min);
    }
});

添加实例方法

$.fn.extend({
    drag : function () {
        var disX,
            disY,
            self = this;
        $(this).on('mousedown', function (e) {
            disX = e.pageX - $(this).offset().left;
            disY = e.pageY - $(this).offset().top;

            $(document).on('mousemove', function (e) {
                $(self).css({left: e.pageX - disX, top: e.pageY - disY});
            })

            $(document).on('mouseup', function (e) {
                $(document).off('mousemove').off('mouseup');
            })
        });
        return this;
    }
});
$('.demo').drag();

克隆

var obj1 = {
    lastName : 'deng',
    age : 6,
    girlFriend : {
        name : 'xiaozhang'
    }
}
var obj2 = {
    lastName : 'laodeng',
    age : 50,
    smoke : true,
    girlFriend : {
        name : 'xiaowang',
        age : 1
    }
}
var obj3 = {
    lastName : 'liu',
    fortune : 100000000
}

// 浅层克隆
$.extend(obj1, obj2, obj3);  //--> {lastName: "liu", age: 50, girlFriend: {…}, smoke: true, fortune: 100000000}

// 深层克隆
$.extend(true, obj1, obj2);
obj1.girlFriend.age += 1;  //--> 2

$.noConflict()

var $c = $.noConflict();  // 防止冲突，$c 替换原来的 $